<template>
	<div class="p-AcademicHeadlines">
		<header class="header">
			<back></back>
			<!--<router-link class="back" to="/" slot="left">-->
				<!--<svg class="icon-back" viewBox="0 0 1024 1024"><path fill="#fff" d="M625.777778 1014.857143 201.142857 590.222222c-42.666667-42.666667-42.666667-112.761905 0-155.428571L626.793651 9.142857c11.174603-12.190476 30.47619-12.190476 42.666667 0 12.190476 11.174603 12.190476 30.47619 0 42.666667l-425.650794 426.666667c-9.142857 9.142857-14.222222 21.333333-14.222222 34.539683 0 13.206349 5.079365 25.396825 14.222222 34.539683l424.634921 424.634921c12.190476 11.174603 12.190476 30.47619 0 42.666667-6.095238 6.095238-13.206349 9.142857-21.333333 9.142857C638.984127 1024 631.873016 1020.952381 625.777778 1014.857143z" /></svg><span>返回</span>-->
			<!--</router-link>-->
		</header>
		<main>
			<ul class="m-nav">
				<li @click="handle1" :class="{active: currentTabComponent ==='advisory'? true:false}">学术咨询</li>
				<li @click="handle2" :class="{active: currentTabComponent ==='featured'? true:false}">学术干货</li>
				<li @click="handle3" :class="{active: currentTabComponent ==='notice'? true:false}">公告</li>
			</ul>
			<component v-bind:is="currentTabComponent"></component>
		</main>
	</div>
</template>
<style lang="scss" src='./index.scss'></style>
<script>
import Advisory from '@/components/AcademicHeadlines/advisory'
import Featured from '@/components/AcademicHeadlines/featured'
import Notice from '@/components/AcademicHeadlines/notice'
import Back from '@/components/head/head'
	export default {
		created(){
			this.currentTabComponent = this.$route.params.programa
		},
		data:function(){
			return{
				currentTabComponent: 'advisory'
			}
		},
		components:{
			advisory:Advisory,
            featured:Featured,
			notice: Notice,
            Back
		},
		methods: {
			handle1(){
				this.currentTabComponent = 'advisory'
			},
			handle2(){
				this.currentTabComponent = 'featured'
			},
			handle3(){
				this.currentTabComponent = 'notice'
			}
		},
	}
</script>

